<template>
  <button :class="`btn ${type}`" @click="onClick">
    <slot></slot>
  </button>
</template>

<script>
export default {
  name: 'yu-button',
  props: {
    type: {
      type: String,
      default: 'primary'
    },
    icon: {
      type: String,
      default: 'primary'
    }
  },
  methods: {
    onClick() {
      console.log('Button clicked');
    }
  }
}
</script>


<style scoped>
.btn {
  padding: 8px 16px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.btn.primary {
  background-color: #409eff;
  color: white;
}
</style>
